{% extends "base.html" %}

{% block title %}{{ transient.name }} - 瞬变源详情{% endblock %}

{% block content %}
<div class="row">
    <div class="col-12">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ url_for('index') }}">首页</a></li>
                <li class="breadcrumb-item"><a href="{{ url_for('dataset_detail', dataset_name=dataset_name) }}">样本集 {{ dataset_name }}</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ transient.name }}</li>
            </ol>
        </nav>
    </div>
</div>

<div class="row">
    <div class="col-12">
        <div class="card mb-4">
            <div class="card-header bg-primary text-white">
                <h2 class="mb-0">
                    <i class="fas fa-star"></i> 瞬变源: {{ transient.name }}
                </h2>
            </div>
            <div class="card-body">
                <div class="row mb-4">
                    <div class="col-12">
                        <h4>瞬变源图像</h4>
                        <div class="text-center">
                            {% if transient.image_path.endswith('.fit') %}
                                {% set jpg_path = transient.image_path.replace('.fit', '.jpg') %}
                                <img src="{{ url_for('serve_image', dataset_name=dataset_name, filename=jpg_path.split('/')[-1]) }}" 
                                     alt="{{ transient.name }}" class="transient-image img-fluid" 
                                     style="max-width: 610px; height: 200px; object-fit: contain;">
                            {% else %}
                                <img src="{{ url_for('serve_image', dataset_name=dataset_name, filename=transient.image_path.split('/')[-1]) }}" 
                                     alt="{{ transient.name }}" class="transient-image img-fluid" 
                                     style="max-width: 610px; height: 200px; object-fit: contain;">
                            {% endif %}
                        </div>
                    </div>
                </div>

                <div class="row mb-3">
                    <div class="col-12">
                        <div class="row mb-3">
                            <div class="col-12">
                                <h5>自动分类结果: 
                                    <span class="badge bg-info">
                                        {% if transient.classification in transient_types %}
                                            {{ transient_types[transient.classification] }}
                                        {% else %}
                                            {{ transient.classification }}
                                        {% endif %}
                                    </span>
                                </h5>
                            </div>
                        </div>
                        
                        <h4>人工分类</h4>
                        <div class="form-group d-flex align-items-center">
                            <label class="me-3 mb-0">请选择分类结果:</label>
                            {% for key, value in transient_types.items() %}
                            <div class="form-check me-3">
                                <input class="form-check-input" type="radio" name="manualClassification" id="{{ key }}" value="{{ key }}" 
                                       {% if transient.manual_classify_result == key or (not transient.manual_classify_result and transient.classification == key) %}checked{% endif %}>
                                <label class="form-check-label" for="{{ key }}">{{ value }}</label>
                            </div>
                            {% endfor %}
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-12">
                        <h4>分类判断依据</h4>
                        <div class="table-responsive">
                            <table class="table table-bordered property-table">
                                <thead>
                                    <tr>
                                        <th>分类类型</th>
                                        <th>使用属性</th>
                                        <th>判断条件</th>
                                        <th>人工标注</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <th>有源 (is_source)</th>
                                        <td>
                                            <ul class="mb-0">
                                                {% for attr_name, attr_value in classification_criteria.is_source.attributes.items() %}
                                                <li>{{ attr_name }}: {{ "%.2f"|format(attr_value) }}</li>
                                                {% endfor %}
                                            </ul>
                                        </td>
                                        <td>{{ classification_criteria.is_source.condition }}</td>
                                        <td>
                                            <input class="form-check-input" type="checkbox" 
                                                   id="is_source_check" 
                                                   {% if transient.manual_classify_result == 'is_source' %}checked{% endif %}>
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>热像素 (is_hot_pixel)</th>
                                        <td>
                                            <ul class="mb-0">
                                                {% for attr_name, attr_value in classification_criteria.is_hot_pixel.attributes.items() %}
                                                <li>{{ attr_name }}: {{ "%.2f"|format(attr_value) }}</li>
                                                {% endfor %}
                                            </ul>
                                        </td>
                                        <td>{{ classification_criteria.is_hot_pixel.condition }}</td>
                                        <td>
                                            <input class="form-check-input" type="checkbox" 
                                                   id="is_hot_pixel_check" 
                                                   {% if transient.manual_classify_result == 'is_hot_pixel' %}checked{% endif %}>
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>亮星残差 (is_bright_star_residual)</th>
                                        <td>
                                            <ul class="mb-0">
                                                {% for attr_name, attr_value in classification_criteria.is_bright_star_residual.attributes.items() %}
                                                <li>{{ attr_name }}: {{ "%.2f"|format(attr_value) }}</li>
                                                {% endfor %}
                                            </ul>
                                        </td>
                                        <td>{{ classification_criteria.is_bright_star_residual.condition }}</td>
                                        <td>
                                            <input class="form-check-input" type="checkbox" 
                                                   id="is_bright_star_residual_check" 
                                                   {% if transient.manual_classify_result == 'is_bright_star_residual' %}checked{% endif %}>
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>瞬变源 (is_transient)</th>
                                        <td>
                                            <ul class="mb-0">
                                                {% for attr_name, attr_value in classification_criteria.is_transient.attributes.items() %}
                                                <li>{{ attr_name }}: {{ "%.2f"|format(attr_value) }}</li>
                                                {% endfor %}
                                            </ul>
                                        </td>
                                        <td>{{ classification_criteria.is_transient.condition }}</td>
                                        <td>
                                            <input class="form-check-input" type="checkbox" 
                                                   id="is_transient_check" 
                                                   {% if transient.manual_classify_result == 'is_transient' %}checked{% endif %}>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
<script>
    $(document).ready(function() {
        // 检查 jQuery 是否加载
        if (typeof $ === 'undefined') {
            console.error("jQuery 未加载");
            return;
        }

        // 点击单选框即保存分类结果
        $('input[name="manualClassification"]').change(function() {
            const selectedValue = $(this).val();
            const datasetName = "{{ dataset_name }}";
            const transientName = "{{ transient.name }}";

            $.ajax({
                url: '/save_classification',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify({
                    dataset_name: datasetName,
                    transient_name: transientName,
                    manual_classify_result: selectedValue
                }),
                success: function(response) {
                    // 获取选中项的显示文本
                    const selectedText = $('label[for="' + selectedValue + '"]').text();
                    alert('分类结果已自动保存: ' + selectedText);
                },
                error: function(xhr, status, error) {
                    console.error('保存失败:', error);
                    alert('保存失败: ' + xhr.responseText);
                }
            });
        });
    });
</script>
{% endblock %}